import React from 'react'
import PushModel from "../../../model/push";
import {Button, DatePicker, Input, Popconfirm, Table} from "antd";
import {LeftOutlined, RightOutlined,} from '@ant-design/icons';
import Admin from "../../../layout/Admin";
import moment from "moment";

class PushList extends React.Component {
    constructor(props) {
        super(props)
        this.model = new PushModel()
        this.state = {
            p: 0,
            list: [],
        }
    }

    componentDidMount() {
        this.all()
    }

    all() {
        this.model
            .all({
                p: this.state.p,
                date: this.state.date,
            })
            .then(res => {
                const list = res.data.ok
                this.setState({
                    list,
                })
            })
    }

    deletePush(pushDate) {
        console.log(pushDate)
        const id = pushDate.Id
        this.model
            .delete({id,})
            .then(res => {
                if (res.data.ok === 1) {
                    this.all()
                }
            })
    }

    prevPage() {
        this.setState({
            p: this.state.p - 1,
        }, () => {
            this.all()
        })
    }

    nextPage() {
        this.setState({
            p: this.state.p + 1,
        }, () => {
            this.all()
        })
    }

    render() {
        const footer = <div style={{
            paddingTop: 8,
            display: "flex",
            justifyContent: "flex-end",
        }}>
            <Button
                style={{marginRight: 8,}}
                onClick={(e) => this.prevPage()}
            ><LeftOutlined /></Button>
            <a className='ant-pagination-item ant-pagination-item-active '>{this.state.p + 1}</a>
            <Button
                onClick={(e) => this.nextPage()}
            ><RightOutlined /></Button>
        </div>

        const cols = [
            // Body: "挪超 - 瓦勒伦加 vs 斯塔贝克"
            // Ext: "{"style":1,"id":3383654}"
            // Id: 14
            // Sendt: 1592809613
            // Title: "挪超 - 瓦勒伦加 vs 斯塔贝克"
            {
                title: 'ID',
                dataIndex: 'Id',
                render: (text,) => text,
            },
            {
                title: '推送时间',
                dataIndex: 'Sendt',
                render: (text,) => moment(new Date(text * 1000)).format('YYYYMMDD HH:mm:ss'),
            },
            {
                title: '推送标题',
                dataIndex: 'Title',
                render: (text,) => text,
            },
            {
                title: '推送内容',
                dataIndex: 'Body',
                render: (text,) => text,
            },
            {
                title: '操作',
                render: (text, record) => (
                    <Popconfirm title="确定删除?" onConfirm={(e) => this.deletePush(record)}>
                        <a>Delete</a>
                    </Popconfirm >
                ),
            }
        ]

        const table = <div className='list-container'>
            <Table
                rowKey={(record, index) => index}
                dataSource={this.state.list}
                columns={cols}
                // rowKey={(record, index) => index}
                pagination={false}
            />
            {footer}
        </div>

        return <>
            <Admin>
                {table}
            </Admin>
        </>

    }

}

export default PushList
